<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('新增属性')" />
    <th:block th:include="include :: select2-css" />
    <th:block th:include="include :: summernote-css" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">

    <form class="form-horizontal m" id="addForm"  style="border: 0px solid red;">


        <div class="form-group">
            <label class="col-sm-3 control-label is-required">优先级：</label>
            <div class="col-sm-9">
                <input type="text" name="priority" class="form-control" value="1" placeholder="请输入优先级" />
            </div>
        </div>

        <div class="form-group appCode">
            <label class="col-sm-3 control-label is-required">应用：</label>
            <div class="col-sm-9">
                <select type="text" name="appCode" id="appCode" class="form-control" >
                </select>
            </div>
        </div>
        <div class="form-group templateKey">
            <label class="col-sm-3 control-label is-required">模板：</label>
            <div class="col-sm-9">
                <select type="text" name="templateKey" id="templateKey" class="form-control" >
                </select>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">属性类别：</label>
            <div class="col-sm-9">
                <select id="addAttributeType" name="attributeType" style="width: 100%" class="form-control">
                    <option value="1" >单个模板属性</option>
                    <option value="0" >公共属性</option>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label is-required">属性名称：</label>
            <div class="col-sm-9">
                <input type="text" name="propertyName" class="form-control" placeholder="请输入属性名称" />
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label is-required">属性key：</label>
            <div class="col-sm-9">
                <input type="text" name="propertyKey" class="form-control" placeholder="请输入属性key" />
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label is-required">标签类型：</label>
            <div class="col-sm-9">
                <select  name="labelType" id="labelType" class="form-control" >
                    <option value="input">input:普通文本框</option>
                    <option value="textarea">textarea:大文本框</option>
                    <option value="editor">editor:富文本</option>
                    <option value="select">select:下拉框</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">是否必填：</label>
            <div class="col-sm-9">
                <select  name="labelRequired" id="labelRequired" class="form-control" >
                    <option value="0">非必填</option>
                    <option value="1">必填</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">标签默认值：</label>
            <div class="col-sm-9">
                <input type="text" name="defaultValue" class="form-control" placeholder="请输入标签默认值" />
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-3 control-label">属性类型：</label>
            <div class="col-sm-9">
                <select  name="propertyType" id="propertyType" class="form-control" >
                    <option value="varchar">varchar 字符串数据</option>
                    <option value="bigint">bigint 极大整数值</option>
                    <option value="decimal">decimal 小数值</option>
                    <option value="date">date (yyyy-MM-dd) 日期值</option>
                    <option value="datetime">datetime (yyyy-MM-dd HH:mm:ss) 日期时间</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">属性长度：</label>
            <div class="col-sm-9">
                <input type="text" name="columnLength" id="columnLength" class="form-control" placeholder="请输入属性长度"/>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">常量：</label>
            <div class="col-sm-9">
                <select name="variableKey" id="variableKey" class="form-control" >

                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">是否在table页展示：</label>
            <div class="col-sm-9">
                <select name="showTable" id="showTable" class="form-control" >
                    <option value="0">不展示</option>
                    <option value="1">展示</option>
                </select>
            </div>
        </div>


        <div class="form-group" style="height: 100%; border:1px #3300FF dashed;padding-top: 15px;padding-bottom:15px;">
            <label class="col-sm-3 control-label">显示标签html：</label>
            <div class="col-sm-9" id="labelTypeDiv" >

            </div>
        </div>

    </form>
</div>

<th:block th:include="include :: footer" />
<th:block th:include="include :: select2-js" />
<th:block th:include="include :: summernote-js" />
<script th:src="@{/js/property.js?v=1}"></script>
<script type="text/javascript">

    groupShow("appCode");
    groupShow("templateKey");
    groupShow("propertyType");
    groupShow("columnLength");
    groupShow("variableKey");

    var appCode = getQuery("appCode");
    if (appCode){
        groupHide("appCode");
    }
    common.loadApp("appCode",appCode);

    var templateKey = getQuery("templateKey");
    if (templateKey && templateKey!=null){
        groupHide("templateKey");
    }
    common.loadTemplate("templateKey",templateKey,appCode);

    $("#appCode").on("change",function () {
        var appCode = $("#appCode").val();
        common.loadTemplate("templateKey","",appCode);
    })

    var prefix = ctx + "m/property";
    common.loadVariable("variableKey","");

    loadLabelType('input',"")

    $("#addForm").validate({
        onkeyup: false,
        rules: {
            priority:{
                required: true,
                maxlength:4,
                number:true
            },
            propertyName:{
                required: true,
                minlength: 2,
                maxlength:32
            },
            propertyKey:{
                required: true,
                minlength: 2,
                maxlength:32
            },
            columnLength:{
                required: true,
                maxlength:4,
                number:true
            },labelValue:{
                maxlength:255,
            },appCode:{
                required: true,
            },templateKey:{
                required: true,
            }
        },
        messages: {

        },
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            var data = $("#addForm").serializeJson();
            data.labelValue = getSelectOptionValue();
            $.operate.save(prefix + "/insert", data,null,true);
        }
    }
</script>
</body>
</html>